<!DOCTYPE html>
<html>

<head>
    <!-- 行高和文字区的关系 -->
    <!-- 可以看到font-size是100px，但是文字区高度要比100px大 -->
    <!-- 不过最终行框的大小还有由line-height决定，而不是文字区 -->
    <meta charset="utf-8">
    <meta charset="utf-8">
    <title>行高测试1</title>
    <style>
        body{
            padding: 20px;
        }

        .box{
            width: 500px;
            font-size: 100px;
            color: #ffffff80;
            background-color: darkmagenta;
            line-height: 100px;
        }

        span{
            background-color: #9e9e9eb3;
        }

    </style>
</head>

<body>
    <div class="box">
        <span>国agh</span>
    </div>

</body>

</html>